import 'package:flutter/material.dart';

class TagPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('tag page')),
      body: Container(
        child: Wrap(
          children: <Widget>[
            TagItem('Start'),
            for (String item in tags) TagItem(item),
            TagItem('End'),
          ],
        ),
      ),
    );
  }
}

class TagItem extends StatelessWidget {
  final String text;

  TagItem(this.text);

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.symmetric(vertical: 2, horizontal: 5),
      margin: EdgeInsets.symmetric(vertical: 5, horizontal: 10),
      decoration: BoxDecoration(
        color: Colors.blueAccent.withAlpha(60),
        borderRadius: BorderRadius.all(
          Radius.circular(5),
        ),
      ),
      child: Text(text),
    );
  }
}

const List<String> tags = [
  'aaaa',
  'bbb',
  'ccc',
  'ddd',
  'eee',
  'fff',
  'ggg',
  'iiii',
  'jjjj',
  'kkk',
  'lll',
  'uuuu'
];
